<!--                       _oo0oo_
                          o8888888o
                          88" . "88
                          (| -_- |)
                          0\  =  /0
                        ___/‘---’\___
                      .' \\|     |// '.
                     / \\|||  :  |||// \
                    / _||||| -:- |||||_ \
                   |   | \\\  -  /// |   |
                   | \_|  ''\---/''  |_/ |
                   \  .-\__  '-'  __/-.  /
                 ___'. .'  /--.--\  '. .'___
              .""  '< '.___\_<|>_/___.' >'  "".
             | | :   '-\'.:'\ _ /':.'/- '  : | |
             \  \ '_.   \_ __\ /__ _/   ._' /  /
         ====='-.____'.    \_____/    .'____._'=====
                           '=---='
                           
                                                      
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                  佛祖保佑                                                                                  永无BUG
 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html >
<head>
 <script type="text/javascript">
 function check(){
	 var name = document.getElementById("name").value;
	 var pwd = document.getElementById("password").value;
	 if(name==""){
		 alert("用户名不能为空哦！");
	     return false;
	 }
	 if(pwd==""){
		 alert("密码不能为空哦！");
		 return false;
	 }
	 return true;
}
</script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>创新创业训练项目管理平台</title>


<link rel="stylesheet" href="css/style.css">
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet" type="text/css">


</head>
<body>
<div class="htmleaf-container">
	
<svg id="svg-source" height="0" version="1.1" xmlns="http://www.w3.org/2000/svg" style="position:absolute; margin-left: -100%" xmlns:xlink="http://www.w3.org/1999/xlink">
	<g id="close-icon">
		<path d="M0.014,1.778L1.79,0.001l30.196,30.221l-1.778,1.777L0.014,1.778z"/>
		<path d="M1.79,31.999l-1.776-1.777L30.208,0.001l1.778,1.777L1.79,31.999z"/>
	</g>
</svg>

<div class="header" id="demo">
	<div class="top_logo"></div>  
     
	<div class="topcn" style="font:20px/18px 'microsoft yahei'; color:#0FF;text-align:center;">
	  <p>&nbsp;</p>
	  <p>支持作者请扫码：</p>
	  <img src="/css/img/clz.png" width="200px" height="200px" />
	</div>
    
    <div class="nav">
        <a class="gv"  id="js-show-modal" href="#">登录</a>
   </div>
   
    
  <div class="canvaszz"> </div>
  <canvas id="canvas"></canvas> 
</div>


<div id="js-modal-overlay" class="modal-overlay"></div>
<div id="js-modal-holder" class="modal-holder">
  <div id="js-effect" style="outline1: 1px solid red" class="effect">
	<div class="effect__burst">
	  <svg viewBox="0 0 300 300" width="300" height="300" id="js-burst">
		<g id="Group" sketch:type="MSLayerGroup" transform="translate(2.000000, 2.000000)">
		  <path d="M119.843557,132.665423 L142.438936,241.234321" stroke="#FC46AD" stroke-width="2" transform="translate(131.141247, 186.949872) rotate(9.000000) translate(-131.141247, -186.949872) "></path>
		  <path d="M120.923275,136.327807 L194.055085,223.544529" stroke="#D0D202" stroke-width="2" transform="translate(157.489180, 179.936168) rotate(9.000000) translate(-157.489180, -179.936168) "></path>
		  <path d="M110.892215,7.63766131 L143.724586,126.274355" stroke="#FFE217" stroke-width="2" transform="translate(127.308401, 66.956008) rotate(-165.000000) translate(-127.308401, -66.956008) "></path>
		  <path d="M198.35904,105.458064 L161.773069,223.598866" stroke="#B8E986" stroke-width="3" transform="translate(180.066054, 164.528465) rotate(-74.000000) translate(-180.066054, -164.528465) ">          </path>
		  <path d="M146.454121,53.5458334 L227.175148,153.69563" stroke="#D0D202" stroke-width="2" transform="translate(186.814634, 103.620732) rotate(-74.000000) translate(-186.814634, -103.620732) ">          </path>
		  <path d="M94.4127006,27.0036828 L46.0682754,156.269505" stroke="#51CAD7" stroke-width="3" transform="translate(70.240488, 91.636594) rotate(-257.000000) translate(-70.240488, -91.636594) ">          </path>
		  <path d="M29.3969741,113.63349 L113.205038,207.338224" stroke="#FC3F6B" stroke-width="2" transform="translate(71.301006, 160.485857) rotate(-257.000000) translate(-71.301006, -160.485857) ">          </path>
		  <path d="M125.792,38.3112087 L198.92381,125.527931" stroke="#D0D202" stroke-width="2" transform="translate(162.357905, 81.919570) rotate(-104.000000) translate(-162.357905, -81.919570) ">          </path>
		  <path d="M43.4006609,130.173225 L130.540432,224.973356" stroke="#FC46AD" stroke-width="2" transform="translate(86.970546, 177.573291) rotate(-278.000000) translate(-86.970546, -177.573291) ">          </path>
		  <path d="M157.646537,8.08731537 L121.060566,126.228117" stroke="#B8E986" stroke-width="3" transform="translate(139.353552, 67.157716) rotate(-187.000000) translate(-139.353552, -67.157716) ">          </path>
		  <path d="M139.340711,132.100895 L90.9962855,261.366717" stroke="#51CAD7" stroke-width="3" transform="translate(115.168498, 196.733806) rotate(-10.000000) translate(-115.168498, -196.733806) ">          </path>
		  <path d="M136.22617,122.003677 L220.034234,215.708411" stroke="#FC3F6B" stroke-width="2" transform="translate(178.130202, 168.856044) rotate(-10.000000) translate(-178.130202, -168.856044) "></path>
		</g>
	  </svg>
	</div>
	<div class="effect__circle">
	  <svg viewBox="0 0 100 100" width="100" height="100">
		<circle cx="50" cy="50" fill="none" id="js-circle"></circle>
	  </svg>
	</div>
	<div class="effect__line effect__line--1">
	  <svg viewBox="0 0 4 900" width="4" height="900">
		<defs>
		  <g id="proto-line" class="js-line">
			<line x1="2" x2="2" y1="0" y2="900" stroke="red" stroke-dasharray="900 1800" stroke-dashoffset="900"></line>
			<line x1="2" x2="2" y1="0" y2="900" stroke="red" stroke-dasharray="900 1800" stroke-dashoffset="900"></line>
			<line x1="2" x2="2" y1="0" y2="900" stroke="red" stroke-dasharray="900 1800" stroke-dashoffset="900"></line>
		  </g>
		</defs>
		<use xlink:href="#proto-line" width="4" height="900"></use>
	  </svg>
	</div>
	<div class="effect__line effect__line--2">
	  <svg viewBox="0 0 4 900" width="4" height="900">
		<use xlink:href="#proto-line" width="4" height="900"></use>
	  </svg>
	</div>
	<div class="effect__line effect__line--3">
	  <svg viewBox="0 0 4 900" width="4" height="900">
		<use xlink:href="#proto-line" width="4" height="900"></use>
	  </svg>
	</div>
	<div class="effect__line effect__line--4">
	  <svg viewBox="0 0 4 900" width="4" height="900">
		<use xlink:href="#proto-line" width="4" height="900"></use>
	  </svg>
	</div>
  </div>
  <form action="/login" onsubmit="return check();" method="post" id="js-modal" class="modal">
	<div id="js-close-button" class="modal__close">
	  <div id="" title="" class="icon ">
		<svg viewBox="0 0 32 32">
		  <use xlink:href="#close-icon"></use>
		</svg>
	  </div>
	</div>
	<div class="modal__header">登录</div>
	<div class="modal__description">#if(check=="no")<font color="red">用户名或密码错误</font>#else#end</div>
	<div class="modal__section">
		<div class="input-with-label">
		  <input id="name" type="text"  name="user.userName" class="input-with-label__input">
		  <label for="name" class="input-with-label__label">用户名
			<div class="input-with-label__label__corner"></div>
		  </label>
		</div>
	</div>
	<div class="modal__section">
		<div class="input-with-label">
		  <input id="password" type="password" name="user.pwd" class="input-with-label__input">
		  <label for="password" class="input-with-label__label">密码
			<div class="input-with-label__label__corner"></div>
		  </label>
		</div>
	</div>
	<div class="modal__section grid grid--sliced grid--gutter-x2">
	  <div text-align:center;class="grid-bit grid-bit--14-20">
		<button text-align:center type="submit" >登录</button>
	  </div>
	</div>
  </form>
  <svg style="display:none">
	<image width="480" height="450" xlink:href="" id="proto-image" class="js-proto-image"></image>
  </svg>
  <div id="js-break-parts" class="break-parts">
	<div id="js-svg-overlay" class="svg-overlay">
	  <svg viewBox="0 0 480 450" id="js-svg1">
		<clipPath id="clip1">
		  <path d="M0,450.575574 L0,0 L424.903452,0 L452.375,28.5599486 L20.5087638,460.426185 L0,450.575574 Z"></path>
		</clipPath>
		<use xlink:href="#proto-image" clip-path="url(#clip1)" id="js-image1"></use>
	  </svg>
	</div>
	<div class="svg-overlay svg-overlay--2">
	  <svg viewBox="0 0 480 450" id="js-svg2">
		<clipPath id="clip2">
		  <path d="M452.214614,28.6494713 L424.309513,0 L482.040672,0 L452.214614,28.6494713 Z"></path>
		</clipPath>
		<use xlink:href="#proto-image" clip-path="url(#clip2)" id="js-image2"></use>
	  </svg>
	</div>
	<div class="svg-overlay svg-overlay--3">
	  <svg viewBox="0 0 480 450" id="js-svg3">
		<clipPath id="clip3">
		  <path d="M452.320312,28.526424 L482,58 L482,0.066291362 L452.320312,28.526424 Z"></path>
		</clipPath>
		<use xlink:href="#proto-image" clip-path="url(#clip3)" id="js-image3"></use>
	  </svg>
	</div>
	<div class="svg-overlay">
	  <svg viewBox="0 0 480 450" id="js-svg4">
		<clipPath id="clip4">
		  <path d="M452.270844,28.4954427 L482,57.8942871 L482,451 L29.2740886,450.99999 L452.270844,28.4954427 Z"></path>
		</clipPath>
		<use xlink:href="#proto-image" clip-path="url(#clip4)" id="js-image4"></use>
	  </svg>
	</div>
  </div>
</div>
</div>

<span>CLZ </span>

<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src='js/howler.min.js'></script>
<script type="text/javascript" src='js/tween.min_1.js'></script>
<script type="text/javascript" src='js/html2canvas.js'></script>
<script type="text/javascript" src="js/index.js"></script>

<script>
//宇宙特效
"use strict";
var canvas = document.getElementById('canvas'),
  ctx = canvas.getContext('2d'),
  w = canvas.width = window.innerWidth,
  h = canvas.height = window.innerHeight,

  hue = 217,
  stars = [],
  count = 0,
  maxStars = 1300;//星星数量

var canvas2 = document.createElement('canvas'),
  ctx2 = canvas2.getContext('2d');
canvas2.width = 100;
canvas2.height = 100;
var half = canvas2.width / 2,
  gradient2 = ctx2.createRadialGradient(half, half, 0, half, half, half);
gradient2.addColorStop(0.025, '#CCC');
gradient2.addColorStop(0.1, 'hsl(' + hue + ', 61%, 33%)');
gradient2.addColorStop(0.25, 'hsl(' + hue + ', 64%, 6%)');
gradient2.addColorStop(1, 'transparent');

ctx2.fillStyle = gradient2;
ctx2.beginPath();
ctx2.arc(half, half, half, 0, Math.PI * 2);
ctx2.fill();

// End cache

function random(min, max) {
  if (arguments.length < 2) {
    max = min;
    min = 0;
  }

  if (min > max) {
    var hold = max;
    max = min;
    min = hold;
  }

  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function maxOrbit(x, y) {
  var max = Math.max(x, y),
    diameter = Math.round(Math.sqrt(max * max + max * max));
  return diameter / 2;
  //星星移动范围，值越大范围越小，
}

var Star = function() {

  this.orbitRadius = random(maxOrbit(w, h));
  this.radius = random(60, this.orbitRadius) / 8; 
  //星星大小
  this.orbitX = w / 2;
  this.orbitY = h / 2;
  this.timePassed = random(0, maxStars);
  this.speed = random(this.orbitRadius) / 50000; 
  //星星移动速度
  this.alpha = random(2, 10) / 10;

  count++;
  stars[count] = this;
}

Star.prototype.draw = function() {
  var x = Math.sin(this.timePassed) * this.orbitRadius + this.orbitX,
    y = Math.cos(this.timePassed) * this.orbitRadius + this.orbitY,
    twinkle = random(10);

  if (twinkle === 1 && this.alpha > 0) {
    this.alpha -= 0.05;
  } else if (twinkle === 2 && this.alpha < 1) {
    this.alpha += 0.05;
  }

  ctx.globalAlpha = this.alpha;
  ctx.drawImage(canvas2, x - this.radius / 2, y - this.radius / 2, this.radius, this.radius);
  this.timePassed += this.speed;
}

for (var i = 0; i < maxStars; i++) {
  new Star();
}

function animation() {
  ctx.globalCompositeOperation = 'source-over';
  ctx.globalAlpha = 0.5; //尾巴
  ctx.fillStyle = 'hsla(' + hue + ', 64%, 6%, 2)';
  ctx.fillRect(0, 0, w, h)

  ctx.globalCompositeOperation = 'lighter';
  for (var i = 1, l = stars.length; i < l; i++) {
    stars[i].draw();
  };

  window.requestAnimationFrame(animation);
}

animation();
</script>

</body>
</html>